<!--
 * @Descripttion: 
 * @LastEditors: xzh
 * @LastEditTime: 2023-11-08 20:08:22
-->
<template>
  <div
    :class="[
      'dile-table-container',
      //布局->自下而上||自上而下
      !!propsParam.bottomUp ? 'table-bottom-top' : 'table-top-bottom',
    ]"
  >
    <!-- 表格工具栏 -->
    <TableTools
      v-if="!!isUseTool"
      class="dile-table-tools"
      ref="tableToolsRef"
      @resetPagination="resetPagination"
    >
      <template #preBtn>
        <slot name="preBtn" />
      </template>
      <template #rightBtn>
        <slot name="rightBtn" />
      </template>
    </TableTools>
    <!-- 表格主体 -->
    <div :class="['dile-table-body']">
      <!-- 判断表格主体是否使用插槽 -->
      <slot v-if="!!useSlots().customBody" name="customBody" />
      <TableBody v-else ref="tableBodyRef">
        <template #preColumn>
          <slot name="preColumn" />
        </template>
        <template #lastColumn>
          <slot name="lastColumn" />
        </template>
        <template #empty><slot name="empty" /></template>
      </TableBody>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive, inject, useSlots, computed } from "vue";
import { propsParam_Inf } from "./index.type";
import type { object_Inf } from "@/utils/typings/index.type";
import { useI18n } from "vue-i18n";
import { ElNotification } from "element-plus";
import TableBody from "./table-body/index.vue";
import TableTools from "./table-tools/index.vue";
import DilePower_Constants from "@/utils/constants/modulePower";

/**
 * @Author: xzh
 * @Descripttion:i18n实例
 * @Param:
 */
let { t } = useI18n();
/**
 * @Author: dile
 * @Descripttion:表格主体实例
 * @Param:
 */
let tableBodyRef = ref<any>(null);
/**
 * @Author: xzh
 * @Descripttion:表格工具栏实例
 * @Param:
 */
let tableToolsRef = ref<any>(null);

/**
 * @Author: xzh
 * @Descripttion:表格参数
 * @Param:
 */
let propsParam = reactive<propsParam_Inf | object_Inf>(
  inject("propsParam") || {}
);

/**
 * @Author: xzh
 * @Descripttion: 表格工具栏是否启用
 * @Param:
 */
let isUseTool = computed(() => {
  let { preBtn, rightBtn } = useSlots(),
    { moduleToolCode, tableToolArr } = propsParam;
  return (
    !!preBtn ||
    !!rightBtn ||
    tableToolArr?.length > 0 ||
    DilePower_Constants[moduleToolCode]?.length > 0
  );
});

/**
 * @Author: xzh
 * @Descripttion:获取表格筛选参数
 * @Param:
 */
let getTableParam = () => {
  let { selectObjArr, className } = propsParam,
    {
      className: filterClassName,
      condition,
      keyWord,
    } = tableToolsRef.value?.toolsParam || {},
    { getPagination = () => {}, getSelectedRow = () => {} } =
      tableBodyRef.value || {};
  return {
    pagination: getPagination(),
    className: filterClassName || className,
    condition: (condition || []).find(() => true),
    keyWord,
    selectObjArr: getSelectedRow(),
  };
};

/**
 * @Author: xzh
 * @Descripttion: 重置分页
 * @Param:
 */
let resetPagination = () => tableBodyRef.value.resetPagination();
/**
 * @Author: xzh
 * @Descripttion:验证是否选中行
 * @Param:
 */
let rowChecked = () => {
  let { getSelectedRow = () => {} } = tableBodyRef.value || {};
  if (getSelectedRow().length == 0) {
    //提示成功
    ElNotification({
      message: t("common.message.pleaseCheckRow"),
      type: "warning",
    });
    return false;
  }
  return true;
};
/**
 * @Author: xzh
 * @Descripttion: 清除行选中
 * @Param:
 * @param {*} checkRowArr 保留勾选行
 */
let clearCheckboxRow = (checkRowArr: Array<object_Inf> = []) => {
  //清楚选中
  tableBodyRef.value.clearCheckboxRow();
  //设置行选中
  checkRowArr.length > 0 &&
    tableBodyRef.value.setCheckboxRow(checkRowArr, true);
};

//暴露数据或方法
defineExpose({
  //获取表格实例
  getVxeTableRef: () => tableBodyRef.value?.getVxeTableRef(),
  //获取表格参数
  getTableParam,
  //验证行选中
  rowChecked,
  //设置行选中
  setCheckboxRow: (dataArr: Array<object_Inf>, isSelected: boolean) =>
    tableBodyRef.value.setCheckboxRow(dataArr, isSelected),
  //清楚行选中
  clearCheckboxRow,
});
</script>
<style lang="scss" scoped></style>
